<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="referrer" content="no-referrer">
		<meta http-equiv="Cache-Control" content="private">
		<meta content="telephone=no,email=no" name="format-detection">
		<meta content="yes" name="apple-mobile-web-app-capable">
		<meta http-equiv="Access-Control-Allow-Origin" content="*" />
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title>设置</title>
		
		<link rel="stylesheet" href="./css/bootstrap/css/bootstrap.css">
		<link rel="stylesheet" href="./css/common/style.css">
		<script src="./js/lib/rem.js"></script>
		<script src="./js/lib/jquery-3.3.1.min.js"></script>
		<script src="./js/lib/common.js"></script>
	</head>
	<style>
		.setup{width:100%;height:100%;background:#f2f2f2;position:fixed;}
		.setup-title{width:100%;height:1rem;line-height:1rem;text-align:center;background:#0c5dac;}
		.setup-title > span{font-size:0.34rem;color:#fff;}
		
		.setup-accept{width:100%;height:0.8rem;margin:0.2rem 0;background:#fff;display:flex;flex-direction:row;align-items:center;justify-content:space-around;}
		.setup-accept > div > input{display:inline;width:0.24rem;height:0.24rem;margin:0 !important;}
		.setup-accept > div > label{font-size:0.26rem;color:#222;font-weight:normal;margin-bottom:0;}
		
		.setup-contain{width:100%;height:calc(100% - 3.4rem);background:#fff;padding-top:0.2rem;}
		.setup-list{width:90%;height:calc(100% - 0.2rem);margin:0 auto 0.2rem;overflow:hidden;}
		.setup-wrap{padding-bottom:0.8rem;}
		.setup-item{width:100%;height:1.6rem;margin-bottom:0.1rem;border-bottom:0.02rem solid #ccc;display:flex;flex-direction:row;justify-content:space-around;}
		.platform-img{width:25%;height:1.6rem;line-height:1.6rem;text-align:center;}
		.platform-img > img{width:1.3rem;height:1.3rem;border-radius:0.1rem;}
		.platform-infor{width:65%;height:1.6rem;}
		.platform-title{width:100%;height:0.5rem;line-height:0.5rem;}
		.platform-title > span{font-size:0.3rem;color:#222;}
		.platform-descript{width:100%;height:1rem;overflow:hidden;}
		.platform-descript > p{width:100%;height:0.9rem;line-height:0.34rem;text-indent:1em;font-size:0.26rem;color:#999;margin:0 !important;}
		
		.platform-empty{width:100%;height:4rem;display:flex;flex-direction:column;justify-content:center;align-items:center;}
		.platform-empty > img{width:1.5rem;height:1rem;}
		.platform-empty > span{font-size:0.3rem;color:#666;margin-top:0.3rem;}
		
		.loadover{width:100%;height:0.8rem;margin-top:0.2rem;text-align:center;}
		.loadover > span{color:#666;font-size:0.3rem;}
		
		.f{width:100%;height:1rem;position:fixed;left:0;bottom:0;background:#fff;display:flex;flex-direction:row;align-items:center;}
		.f > a{height:1rem;margin:0 3%;text-decoration:none;flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;}
		.f > a > span{font-size:0.26rem;color:#636363;}
		.f > a > i{width:0.4rem;height:0.4rem;}
		.f > a > i.index{background:url('./img/icons/index.png') no-repeat;background-size:0.4rem 0.4rem;}
		.f > a > i.config{background:url('./img/icons/setup.png') no-repeat;background-size:0.4rem 0.4rem;}
		.f > a > i.position{background:url('./img/icons/position.png') no-repeat;background-size:0.4rem 0.4rem;}
		.f > a > i.mine{background:url('./img/icons/mine.png') no-repeat;background-size:0.4rem 0.4rem;}
		.config-active{background:url('./img/icons/setup-active.png') no-repeat;background-size:0.4rem 0.4rem;}
		.active-s{color:#0c5dac !important;}
	</style>
	<body>
		<div class="setup">
			<div class="setup-title">
				<span>平台接入接口设置</span>
			</div>
			
			<div class="setup-accept">
				<div>
					<input type="checkbox" id="private">
					<label for="private">私钥修复(不勾选无收益)</label>
				</div>
				<div>
					<input type="checkbox" id="protocol">
					<label for="protocol">协议调用(不勾选无收益)</label>
				</div>
			</div>
			
			<div class="setup-contain">
				<div class="setup-list">
					<div class="setup-wrap" id="platformList">
						
					</div>
					
				</div>
			</div>
			
			<div class="f">
				<a href="./index.html"><i class="index"></i><span>首页</span></a>
				<a href="./setup.html"><i class="config-active"></i><span class="active-s">设置</span></a>
				<a href="./position.html"><i class="position"></i><span>定位</span></a>
				<a href="./person.html"><i class="mine"></i><span>我的</span></a>
			</div>
		</div>
		
		<!-- private and protocol select state -->
		<div class="state-modal" id="loadLayer">
			<div class="statemodal-contain">
				<div class="statemodal-content">
					<div class="statemodal-icon">
						<i class="" id="loadicon"></i>
					</div>
					<div class="statemodal-text" >
						<span id="loadContext">数据加载中…</span>
					</div>
				</div>
			</div>
		</div>
		
		<div id="taskdiv"></div>
		
		<!-- putforward modal -->
		<div class="infor-modal" id="inforModal">
			<div class="infor-inner">
				<div class="infor-contain">
					<div class="informodal-title">
						<div class="modal-title">
							<span>试玩助手</span>
						</div>
					</div>
					<div class="inforModal-content">
						<span id="inforContextTitle"></span>
						<span id="inforContext"></span>
					</div>
				</div>
			</div>
		</div>
		
		<script src="./js/sendtask.js?v=1043"></script>
		<script type="text/javascript" src="./js/lib/map/maps.js"></script>
		<script src="./js/lib/mui/mui.min.js"></script>
		
	<script src="./js/lib/iscroll/iscroll.js"></script>
	<script>
		
		$(function(){
			
			var taskstate = localStorage.getItem('taskstate');
			if(taskstate === "true"){
				//after five minutes send task start
				setTimeSendTaskStart();
			}
			
			var ppkey = localStorage.getItem('ppkey');
			var tips = location.href.split('=')[1];
			if(ppkey === "true" && tips === '1'){
				$('#loadicon').removeAttr('class').addClass('tipsicon');
				$('#loadLayer').show();
				$('#loadContext').text('请勾选私钥和协议');
				
				setTimeout(function(){
					$('#loadLayer').hide();
				},2000)
			}
			
			var urlip = localStorage.getItem('urlip');
			var url = 'http://'+ urlip +':8080/platform-web/';
			
			var pageIndex = '1';
			var myScroll = null;
			var pageTotal = null;
			
			//select protocol and private
			setProtocolAndPrivateState()
			
			//select protocol and private
			function setProtocolAndPrivateState(){
				var privatestate = localStorage.getItem('privatestate')
				if( privatestate === 'true'){
					$('#private').attr('checked',true)
				}else{
					$('#private').attr('checked',false)
				}
				
				var protocolstate = localStorage.getItem('protocolstate');
				if( protocolstate === 'true'){
					$('#protocol').attr('checked',true)
				}else{
					$('#protocol').attr('checked',false)
				}
				
				$('#private').on('changeprototype change',function(){
					if( $(this).is(':checked') ){
						localStorage.setItem('privatestate',true);
					}else{
						localStorage.setItem('privatestate',false);
					}
				})
				
				$('#protocol').on('changeprototype change',function(){
					if( $(this).is(':checked') ){
						localStorage.setItem('protocolstate',true);
					}else{
						localStorage.setItem('protocolstate',false);
					}
				})
			}

			//loadlist
			loadList(url,pageIndex);
			
			//after loaded scroll
			myScroll = new IScroll('.setup-list',{
				click: true,
				taps:true,
			});
			
			myScroll.on('scrollEnd',function(){
				
				if (this.maxScrollY == this.y) {
					if( pageIndex < pageTotal){
						pageIndex++;
												
						$('#loadicon').removeAttr('class').addClass('loadicon')
						$('#loadLayer').show();
						$('#loadContext').text('页面加载中...');
						
						setTimeout(function(){
							$('#loadLayer').hide();
						},1500)
						
						//加载列表
						loadList(url,pageIndex);
					}else{
						if( !( $('#platformList').children('div').hasClass('loadover') ) ){
							$('#platformList').append('<div class="loadover"><span>没有更多数据了...</span></div>')
						}
					}
				}
			});

			function loadList(url,pageIndex){
				
				$.ajax({
					type:'POST',
					url:url+'platform/platformList',
					dataType:'json',
					data:{
						pageNum:pageIndex, //当前页
						pageDataCount:10 //每页的数据条数
					},
					success:function(data){
						if(data.code === 403){
							location.href = './login.html'
						}else if(data.code === 404){
							alert('设备被锁')
						}else if(data.code == 5000 ){
							pageTotal = data.pages;
							if(data.pageList.length !== 0){
								var platformListHtml = '';
								for(var i=0;i<data.pageList.length;i++){
									platformListHtml += '<div class="setup-item" data-listId="'+ data.pageList[i].id +'"><div class="platform-img">'+
														'<img src="'+ data.pageList[i].image +'" alt="">'+
														'</div><div class="platform-infor"><div class="platform-title">'+
														'<span>'+ data.pageList[i].title +'</span>'+
														'</div><div class="platform-descript">'+
														'<p>'+ data.pageList[i].introduce +'</p>'+
														'</div></div></div>'
								}
								$('#platformList').append(platformListHtml);
								myScroll.refresh();
							}else{
								myScroll.destroy();
								$('#platformList').html('<div class="platform-empty"><img src="./img/icons/no-record.png" alt=""><span>暂无数据</span></div>');
							}
						}
					}
				});
			}
			
			
		});
	</script>
	</body>
</html>
